<template>
 <div>
    <app-header></app-header>
    <app-navbar></app-navbar>
    <app-main></app-main>
    
 </div>
</template>

<script>
    import AppHeader from '@/components/AppHeader'
    import AppNavbar from './AppNavbar'
    import AppMain from './AppMain'
export default {
 data () {
 return {
 }
 },

 components: {
    AppHeader,
    AppNavbar,
    AppMain
 },

 methods: {}
}
</script>

<style scoped>
    .header{
        position: absolute;
        line-height: 50px;
        padding: 0px;
        top: 0;
        left: 0;
        right: 0;
        background-color: #374250;
    }
    .navbar{
        position: absolute;
        width: 230px;
        top: 50px;
        left: 0;
        bottom: 0;
        overflow-y:auto;
        background-color: #525e6c;
    }
    .main{
        position: absolute;
        top: 50px;
        left: 230px;
        right: 0;
        bottom: 0;
        padding: 10px;
        overflow-y:auto;
        /* background-color:rgb(0, 128, 113); */
    }
</style>